<template>
  <div>
        <!-- <van-cell v-for="item in list" :key="item" :title="item" /> -->
        <div class="list">
          <div class="list_item">
            <h1 class="list_item_title">{{listDataObj.titleCn}}</h1>
            <!-- <h1 class="list_item_title">{{}}</h1> -->
            <ul class="list_item_ul" @click="handleDetails(listDataObj)">
              <li>
                <p>{{this.$t('message.cglx')}} :</p>
                <span class="list_item_ul_li_value">{{listDataObj.businessType}}</span>
              </li>
              <li>
                <p>{{this.$t('lackMsg.tjsj')}} :</p>
                <span class="list_item_ul_li_value" v-if="listDataObj.approvalStatus !== 'shzt01'">{{listDataObj.submitTime}}</span>
              </li>
              <li>
                <p>{{$t('message.zt')}}：</p>
                <!-- <span class="list_item_ul_li_value">{{listDataObj.approvalStatusCN}}</span> -->
                <span class="list_item_ul_li_value1" @click.stop="popUp(listDataObj)">{{listDataObj.approvalStatusName}}</span>
              </li>
            </ul>
          </div>
        </div>
            <div class="list_item_button" v-if="  listDataObj.operate && listDataObj.operate.edit">
                <van-button type="default" class="btn" plain   @click="editContract(listDataObj)">{{$t('message.bj')}}</van-button>
                <div class="list_btn">
                  <button type="default" class="btn btn1" style="color: #666666" v-if="listDataObj.operate && listDataObj.operate.del" @click="handerDelete(listDataObj)" >{{$t('message.sc')}}</button>
                </div>
            </div>

            <div class="list_item_button"  v-if="listDataObj.operate && listDataObj.operate.track">
                <van-button type="default" class="btn"  @click="linkTo(listDataObj, 'achievementsTrace', 'contractTrace')">{{$t('message.zz')}}</van-button>
            </div>
            <div class="list_item_button" v-if="listDataObj.operate && listDataObj.operate.trackEdit">
                <van-button type="default" class="btn"  @click="linkTo(listDataObj, 'achievementsTrace', 'contractTrace')">{{$t('message.zzbj')}}</van-button>
            </div>

            <div class="list_item_button" v-if="listDataObj.operate && listDataObj.operate.approve">
                <van-button type="default" class="btn"  @click="linkTo(listDataObj, 'audit', 'audit')" clstag="pageclick|keycount|M_result_approve|approval_click">{{$t('message.sh')}}</van-button>
            </div>

            <div class="list_item_button" v-if="listDataObj.operate && listDataObj.operate.trackingApproval">
              <van-button type="default" class="btn"  @click="linkTo(listDataObj, 'audit', 'audit')">{{$t('message.zzsh')}}</van-button>
            </div>

            <div class="list_item_button"  v-if="listDataObj.operate && listDataObj.operate.reApproval">
              <van-button type="default" class="btn" @click="revoke(listDataObj)">{{$t('message.qx')}}</van-button>
            </div>
  </div>
</template>

<script>  
export default {
  props: {
    listDataObj: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      
    };
  },
  methods: {
    /** 按钮 */
    linkTo(query = {}, target, target1) {
      if (query.baseCode === "RELEASE") {
        console.log(query,'query')
          this.$router.push({
            path: `/${target}`,
            query: {
              id: query.id,
              obj:query.baseCode,
              auditClassification: query.auditClassification
            }
        })
      }
      else {
        console.log(query,'query')
         this.$router.push({
            path: `/${target1}`,
            query: {
              id: query.id,
              obj:query.baseCode,
              auditClassification:query.auditClassification
            }
        })
      }
    },
    // 撤销
    revoke(query) {
      this.$emit('revokeBtn', query)
    },
    // 编辑
    editContract(query){
       if( query.baseCode === 'RELEASE' ) {
        this.$router.push({path: '/achievementsSecond', query: { id: query.id, state: 'edit'}})  // 成果
      }else {
        this.$router.push({path: '/contractSecond', query: { id: query.id, state: 'edit'}})
      }
    },

    // 删除
    handerDelete(query) {
      this.$emit('handerDelete', query)
    },
    /**
     * 点击跳转详情页按钮
     */
    handleDetails(query) {
      if( query.baseCode === 'RELEASE' ) {
        this.$router.push({path: '/achievementsDetail', query: { id: query.id}})
      }else {
        this.$router.push({path: '/contractDetail', query: { id: query.id}})
      }
    },
    /**
     * 点击状态 是显示弹窗
     */
    popUp(query) {
      this.$emit('popUpCall',query)
    },
  }
};
</script>

<style lang="scss" scoped>
.list {
  padding: 10px 10px 0 10px;
}
.list_item {
  margin-top: 5px;
  background: #ffffff;
  border-radius: 8px;
  .list_item_title {
    font-size: 16px;
    color: #212121;
    font-weight: 600;
    font-family: PingFangSC-Medium;
  }

}
.list_item_ul {
  margin-top: 15px;
  li {
    display: flex;
    margin-top: 5px;
    p {
      font-size: 14px;
      color: #666666;
    }
    .list_item_ul_li_value {
      color: #212121;
      font-size: 14px;
      padding-left: 10px;
    }
    .list_item_ul_li_value1 {
      color: #FE8B01;
    }
  }
   li:last-of-type{
      padding-bottom:10px;
   }
}

.van-button__text {
  color: #FE8B01;
  font-size: 17px;
}
.van-step {
  color: #666666;
}
.btn1 {
  color: #666666;
  background: none;
  font-size: 17px;
  text-align: center;
}
.van-button--normal {
  padding: 0;
}
.list_item_button {
    border-top: 1px solid #E9ECF0;
    display: flex;
    flex-wrap: wrap;
    padding-top: 4px;
    margin-top: 5px;
    padding: 0;
    .list_btn {
      flex: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      border-left: 1px solid #eeeeee;
    }
    .btn {
      flex: 1;
      border: 0;
      font-size: 17px;
    }
    .list_item_border {
      width: 1px;
      height: 42px;
      background: #E9ECF0;
    }
  }
</style>